// dim management
import React, { Component } from 'react';
import {Layout, Button, Tooltip, Select, Input, Row, message, Search, Modal} from 'antd';
import '../App.css';

import '../pages/webExcel.css'
import {getDims,getDims2,delDimMbr,getTheMbr} from "../api/dim";
import DimTree from './dimTree.js'
import Dim_Info from "./dim_Info";
import {ExclamationCircleOutlined} from "@ant-design/icons";
import {delUser} from "../api/Security";
const { Header, Content, Footer } = Layout;
const { Option } = Select;

export default class DimManagement extends Component {

    constructor(props) {
        super(props)
        this.state = {
            cubes:[],
            operations:[],
            dims:[],  //文本
            alias:[],
            datastores:[],
            account_type:[],
            balance_type:[],
            data_store_types:[],
            selectDimType:111,  //           dimId
            isModalVisible:false,  //维度编辑模态框
            selectedRows:[], //选中树的节点
            parentMemberId:-1,   //selectedRows[0].id
            flg:"1" ,    //1添加子代  0 添加同级
            //expandAll:false //展开树
            mbrName:"",  //维度成员
            formulaTxt:"" //公司


        }
    }

    componentDidMount() {
        getDims2().then(
            (res) => {

                this.setState({dims: res.data.dimensions,alias:res.data.alias,
                    datastores:res.data.datastores,
                    account_type:res.data.account_type,
                    balance_type:res.data.balance_type,
                    data_store_types:res.data.data_store_types,
                    cubes:res.data.cubes,
                    operations:res.data.operations,
                    mbrName:"",
                    formulaTxt:""
                });

            },
            (error) => {
                console.log("get response failed!");
            }
        );
    }

    dimTreeRef=(ref)=>{
        this.dimTree = ref
    }

     handleChange=(value)=> {
        //this.state.selectDimType=value;
        this.setState({selectDimType:value});
        console.log(`selected ${this.state.selectDimType}`);
    }
    onSearch = value => console.log(value);

//关闭模态框
    cancelModal = () => {
        this.setState({
            isModalVisible: false,
        });
    };
//创建新成员
    createNewMbr = () => {
        if(this.state.selectedRows.length==0){
            alert('请选择一个维度成员');
            return;
        } else if(this.state.selectedRows.length>1){
            alert('只能选择一个维度成员');
            return;
        }

        if(this.state.selectedRows.length>0)
        {
            this.setState({
                isModalVisible: true,
                flg:1,
                mbrName:"",
                formulaTxt:""
            });
        }
    };


    //编辑成员
    editMbr = () => {

        if(this.state.selectedRows.length==0){
            alert('请选择一个维度成员');
            return;
        } else if(this.state.selectedRows.length>1){
            alert('只能选择一个维度成员');
            return;
        }

        if(!this.state.selectedRows.length>0)
        {
            return;
        }
        let _dimId=this.state.selectDimType;
        let _mbrId=this.state.selectedRows[0].id;;
            getTheMbr(_dimId,_mbrId).then(
                (res) => {
                    //debugger;
                    //console.log(res.data)
                    this.setState({
                        //dims: res.data.dimensions,alias:res.data.alias,
                        // datastores:res.data.datastores,
                        // account_type:res.data.account_type,
                        // balance_type:res.data.balance_type,
                        // data_store_types:res.data.data_store_types,
                        // cubes:res.data.cubes,
                        // operations:res.data.operations,
                        isModalVisible: true,
                        flg:0,  //0是编辑
                        mbrName:res.data.mbr.name, //从树当前取得应该也是可以的 是否一定要向后台查呢 指的商榷
                        formulaTxt:res.data.mbrFormulaTxt
                    });

                },
                (error) => {
                    console.log("get response failed!");
                }
            );


    };


    //删除维度成员
    delDimMbr=()=>{
        if(this.state.selectedRows.length==0){
            alert('请选择一个维度成员');
            return;
        } else if(this.state.selectedRows.length>1){
            alert('只能选择一个维度成员');
            return;
        }
        let mbmId=this.state.selectedRows[0].id;
       // alert(mbmId+"----"+this.state.selectDimType);
        const clearSelectedRows=()=>{
            this.setState({selectedRows:[]});
        }



        let _selectDimType=this.state.selectDimType;
        const { confirm } = Modal;
        confirm({
            title: 'Do you Want to delete this items',
            icon: <ExclamationCircleOutlined />,
            content: '删除选中的节点',
            onOk() {
                delDimMbr(mbmId,_selectDimType).then(
                    (res) => {
                        //todo
                        message.success("success");
                        // let _selectDimType=this.state.selectDimType;
                        //this.setState({selectedRows:[]})
                        clearSelectedRows();
                    },
                    (error) => {
                        console.log("get response failed!");
                    }
                );
            },
            onCancel() {
                console.log('Cancel');
            },
        });
    }

    //现在行的方法 参数为选中的行对象数组
    selectRowsInTree=(para_selectedRows)=>{
        this.setState({selectedRows:para_selectedRows});
    }


    expandDimTree=()=>{
        this.dimTree.expandTree();
    }

    collapseDimTree=()=>{
        this.dimTree.collapseTree();
    }

    render() {
        const { Option } = Select;
        const { Search } = Input;

        return (
            <>
            <Row>
                <Select defaultValue={111} style={{ width: 150 }} onChange={this.handleChange}>
                    {
                        this.state.dims.map((item,index)=>{
                            return (
                                <Option value={ item.id } key={ index }>{ item.name }</Option>
                            )
                        })
                    }
                </Select>
                <Button disabled={true}>添加维</Button>
                <Button disabled={true}>编辑维</Button>
                <Button disabled={true}>删除维</Button>
                <Button>属性维</Button>
                <Button onClick={this.expandDimTree}>展开</Button>
                <Button  onClick={this.collapseDimTree}>收拢</Button>
                <Search placeholder="input search text" onSearch={this.onSearch} style={{ width: 200 }} />
            </Row>

                <Row>
                    <Button disabled={true}>设置</Button>
                    <Button  onClick={() => this.createNewMbr()}>添加子代</Button>
                    <Button>添加同级</Button>
                    <Button   onClick={() => this.editMbr()}>编辑</Button>
                    <Button  onClick={() => this.delDimMbr()}>删除</Button>
                    <Button>显示用例</Button>
                    <Button>上移</Button>
                    <Button>下移</Button>
                </Row>

            <div>
                <DimTree
                    selectDimType={this.state.selectDimType}
                    selectRowsMethod={this.selectRowsInTree}
                    //expandAll={this.state.expandAll}
                    onRef={this.dimTreeRef}
                />
            </div>
                <Dim_Info
                    visible={this.state.isModalVisible}
                    onCancel={this.cancelModal}
                    cubes={this.state.cubes}
                    dims={this.state.dims}
                    alias={this.state.alias}
                    datastores={this.state.datastores}
                    account_type={this.state.account_type}
                    balance_type={this.state.balance_type}
                    data_store_types={this.state.data_store_types}
                    operations={this.state.operations}
                    dimId={this.state.selectDimType}
                    selectedRows={this.state.selectedRows}
                    flg={this.state.flg}
                    mbrName={this.state.mbrName}
                    formulaTxt={this.state.formulaTxt}
                />
            </>
        )
    }

}
